<mat-toolbar-row>
  <app-bfilter (change)="filterChanged($event)" *ngIf="!searchText"></app-bfilter>

  <span class="header-spacer"></span>

  <mat-form-field style="width: 240px;">
    <mat-icon matPrefix svgIcon="find"></mat-icon>
    <input matInput [(ngModel)]="searchText" matTooltip="{{'searchMonitor' | translate}}" placeholder="{{'searchMonitor' | translate}}">
    <button mat-button *ngIf="searchText" matSuffix mat-icon-button aria-label="Clear" (click)="searchText=''">
      <mat-icon svgIcon="close"></mat-icon>
    </button>
  </mat-form-field>
</mat-toolbar-row>

<div infiniteScroll [infiniteScrollDistance]="2" [infiniteScrollThrottle]="50" [infiniteScrollContainer]="selector" (scrolled)="onScroll()" [fromRoot]="true">
  <mat-grid-list cols="{{colNumber}}" rowHeight="180px">
    <mat-grid-tile *ngFor="let person of persons">
      <app-mobject [person]="person"></app-mobject>
    </mat-grid-tile>
  </mat-grid-list>
</div>
